<template>
  <div id="amap">
    <el-amap vid="amap" class="amap" :center="center" :plugin="plugin" :zoom="mapConfig.zoom">
      <el-amap-marker vid="component-marker" :position="position" />
      <el-amap-marker vid="component-marker" :position="mapConfig.p1" />
      <el-amap-marker vid="component-marker" :position="mapConfig.p2" />
      <el-amap-marker vid="component-marker" :position="mapConfig.p3" />
      <el-amap-marker vid="component-marker" :position="mapConfig.p4" />
      <el-amap-marker vid="component-marker" :position="mapConfig.p5" />
    </el-amap>
  </div>
</template>

<script>
export default {
  name:"Map",
  data() {
    return {
      position: [116.481485, 39.990464], // 定位
      center: [112.81011 , 31.11087],   // 地图初始化视图中心点
      plugin: [                          // 这里放扩展的插件
        {
          pName: 'Scale',                // 比例尺
          events: {
            init(instance) {
              console.log(instance);
            }
          }
        }
      ],
      mapConfig: {
        zoom: 6,    // 当前缩放层级
        p1: [115.81366 , 29.23421],
        p2: [115.44740 , 27.32434  ],
        p3: [121.45375 , 31.33066 ],
        p4: [108.89401 , 34.20246],
        p5: [104.07274 , 30.57899],
      },
    };
  },
  mounted() {},
  created() {
  },
  methods: {}
};
</script>

<style scoped>
#amap {
  height: 100vh;
  width: 100vw;
}
</style>



